<template>
	<view class="page">
		<view class="load-progress" :hidden="!loadProgress">
			<view
				class="load-progress-bar bg-green"
				:style="[{ transform: 'translate3d(-' + (100 - loadProgress) + '%, 0px, 0px)' }]"
			></view>
			<view class="load-progress-spinner text-green"></view>
		</view>
		<!-- 全局容器 -->
		<slot></slot>

		<!-- #ifdef MP-WEIXIN -->
		<!-- 用户隐私协议 -->
		<!-- <privacy-popup></privacy-popup> -->
		<!-- #endif -->
	</view>
</template>

<script setup lang="ts">
import store from '@/store'
// #ifdef MP-WEIXIN
// import privacyPopup from './privacy-popup.vue'
// #endif

let timer = 0
let loadProgress = ref(0)
let showProgress = computed(() => {
	return store.state.showProgress
})

function start() {
	clearTimeout(timer)
	loadProgress.value += 10
	if (loadProgress.value < 100) {
		timer = setTimeout(() => {
			start()
		}, 100)
	} else {
		loadProgress.value = 0
	}
}

watch(
	store.user.userData,
	newVal => {
		// #ifdef MP
		if (newVal.userInfo.id && !newVal.userInfo.bind_wx_small) {
			let pages: any[] = getCurrentPages()
			let curPage: any = pages[pages.length - 1]

			let whiteList = ['pages/login/login', 'pages/login/bindMobile']

			if (!whiteList.includes(curPage?.route)) {
				store.user.reLogin()
			}
		}
		// #endif
	},
	{
		deep: true // 深度监听
	}
)

watch(showProgress, (newVal: any) => {
	if (newVal) {
		start()
	} else if (newVal == -1) {
		loadProgress.value = 0
	}
})
</script>

<style lang="scss" scoped>
.page {
	width: 100%;
	overflow: auto;
}
</style>
